//基础组件库
export default [{
  label: '图表',
  icon: 'el-icon-s-data',
  type: 'layer',
  img: require('../assets/chart.svg'),
  img2: require('../assets/chart2.svg'),
  children: [{
    label: '通用型',
    type: "common",
    icon: 'icon-bar',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '通用型',
      type: "common",
      type2: 'common',
      img: require('../assets/layer_bar.svg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "苹果",
          "三星",
          "小米",
          "oppo",
          "vivo"
        ],
        series: [{
          name: "手机品牌",
          data: [
            1000879,
            3400879,
            2300879,
            5400879,
            3400879
          ]
        }]
      },
      echartFormatter: "(data)=>{return {\n            title: {\n\t\t\t\t textStyle: {\n\t\t\t\t\tfontWeight: 'normal',      \n\t\t\t\t\tcolor: '#fff'\n\t\t\t\t},\n                text: 'ECharts 入门示例'\n            },\n            tooltip: {},\n            legend: {\n                data:['销量'],\n\t\t\t\ttextStyle: {\n\t\t\t\t\tfontWeight: 'normal',      \n\t\t\t\t\tcolor: '#fff'\n\t\t\t\t},\n            },\n            xAxis: {\n                data: [\"衬衫\",\"羊毛衫\",\"雪纺衫\",\"裤子\",\"高跟鞋\",\"袜子\"]\n            },\n            yAxis: {},\n            series: [{\n                name: '销量',\n                type: 'bar',\n                data: [5, 20, 36, 10, 10, 20]\n            }]\n        };\n}",
      time: 5000,
      option: {},
    }],
  }, {
    label: '自定义',
    type: "vue",
    icon: 'icon-bar',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '自定义',
      type: "vue",
      type2: "vue",
      img: require('../assets/layer_bar.svg'),
      width: 500,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: {
        name: "avue"
      },
      dataFormatter: "",
      stylesFormatter: "",
      option: {
        f_Content: "<template>\n    <div class=\"test\">\n        <h1 @click=\"handleClick\">{{dataChart}}</h1>\n    </div>\n</template>\n<script>\nexport default{\n    data(){\n        return{\n            \n        }\n    },\n    created(){\n        console.log(this.$parent);\n    },\n    methods:{\n        handleClick(){\n            this.$message.success(this.dataChart.name)\n        }\n    }\n}\n</script>\n<style>\n    .test{\n        text-align:center;\n        color:red;\n        font-size:40px;\n    }\n</style>"
      }
    }],
  }, {
    label: '柱形图',
    type: "bar",
    icon: 'icon-bar',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '基础柱状图',
      type: "bar",
      type2: "bar_basic",
      img: require('../assets/bar_basic.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: '用例1',
          data: [780, 900, 600, 500, 250, 110],
        }, {
          name: '用例2',
          data: [550, 750, 550, 400, 200, 70],
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#29C287",
          color2: "#29C287",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '柱状图',
      type: "bar",
      type2: "bar",
      img: require('../assets/bar.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: ["男生", "女生"],
        series: [{
          name: "性别",
          data: [{
            value: 900,
            itemStyle: {
              color: '#29C287'
            }
          }, {
            value: 500,
            itemStyle: {
              color: '#5D95FF'
            }
          }],
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#83bff6",
          color2: "#188df0",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        legend: false,
      }
    }, {
      label: '单柱状图',
      type: "bar",
      type2: "bar_single",
      img: require('../assets/bar_single.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
          "类别6",
        ],
        series: [{
          name: "系列1",
          data: [760, 350, 600, 500, 250, 100]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }],
        barMinHeight: 2
      }

    }, {
      label: '带背景色柱状图',
      type: "bar",
      type2: "bar_background",
      img: require('../assets/bar_background.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: '用例1',
          data: [750, 900, 600, 500, 400, 500],
        }, {
          name: '用例2',
          data: [520, 250, 750, 460, 300, 350],
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#29C287",
          color2: "#29C287",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        showBackground: true,
      }
    }, {
      label: '带标题柱状图',
      type: "bar",
      type2: "bar_title",
      img: require('../assets/bar_title.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
          "类别6",
        ],
        series: [{
          name: "系列1",
          data: [760, 350, 600, 500, 250, 100]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }],
        barMinHeight: 2,
        titleShow: true,
        title: '2023年度上半年财政支出',
        titleColor: '#FFFFFF'
      }
    }, {
      label: '带标题和背景色柱状图',
      type: "bar",
      type2: "bar_title_background",
      img: require('../assets/bar_title_background.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: '用例1',
          data: [750, 900, 600, 500, 400, 500],
        }, {
          name: '用例2',
          data: [520, 250, 750, 460, 300, 350],
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#29C287",
          color2: "#29C287",
          postion: 50,
          $index: 1,
          _show: true
        }],
        showBackground: true,
        barMinHeight: 2,
        titleShow: true,
        title: '2023年度支出分析',
        titleColor: '#FFFFFF'
      }
    }, {
      label: '指标柱状图',
      type: "bar",
      type2: "bar_target",
      img: require('../assets/bar_target.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "苹果",
          "三星",
          "小米",
          "oppo",
          "vivo"
        ],
        series: [{
          name: "手机品牌",
          data: [
            1000879,
            3400879,
            2300879,
            5400879,
            3400879
          ]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        gridX: 90,
        gridY: 0,
        gridX2: 30,
        gridY2: 0,
        legend: true,
        nameColor: "#eee",
        lineColor: "#eee",
        xNameFontSize: 16,
        yNameFontSize: 16,
        labelShow: true,
        labelShowColor: '#fff',
        labelShowFontSize: 14,
        labelShowFontWeight: 'normal',
        yAxisInverse: false,
        xAxisInverse: false,
        xAxisShow: true,
        yAxisShow: true,
        xAxisSplitLineShow: false,
        yAxisSplitLineShow: false,
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#83bff6",
          color2: "#188df0",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '渐变柱状图',
      type: "bar",
      type2: "bar_gradient",
      img: require('../assets/bar_gradient.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
        ],
        series: [{
          name: "系列1",
          data: [600, 650, 400, 250, 750]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#29C287",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '堆叠柱状图',
      type: "bar",
      type2: "bar_pile",
      img: require('../assets/bar_pile.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
          "类别6",
        ],
        series: [{
          name: "系列1",
          data: [100, 200, 250, 100, 50, 100]
        }, {
          name: "系列2",
          data: [270, 50, 150, 100, 200, 300]
        }, {
          name: "系列3",
          data: [400, 200, 300, 400, 200, 150]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#29C287",
          color2: "",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#fac858",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        isStack: true
      }

    }, {
      label: '带边框堆叠柱状图',
      type: "bar",
      type2: "bar_border_pile",
      img: require('../assets/bar_border_pile.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
          "类别6",
        ],
        series: [{
          name: "系列1",
          data: [100, 200, 250, 100, 50, 100]
        }, {
          name: "系列2",
          data: [270, 50, 150, 100, 200, 300]
        }, {
          name: "系列3",
          data: [400, 200, 300, 400, 200, 150]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#29C287",
          color2: "",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#fac858",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        isStack: true,
        showBorder: true,
        barBorderColor: '#FFFFFF',
        barBorderPx: 1
      }
    }, {
      label: '分隔堆叠柱状图',
      type: "bar",
      type2: "bar_separate_pile",
      img: require('../assets/bar_separate_pile.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
          "类别5",
          "类别6",
        ],
        series: [{
          name: "系列1",
          data: [100, 200, 250, 100, 50, 100]
        }, {
          name: "系列2",
          data: [270, 50, 150, 100, 200, 300]
        }, {
          name: "系列3",
          data: [400, 200, 300, 400, 200, 150]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#29C287",
          color2: "",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#fac858",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        isStack: true,
        showBorder: true,
        barBorderColor: 'rgba(255,255,255,0)',
        barBorderPx: 4
      }
    }, {
      label: '点渐变堆叠柱状图',
      type: "bar",
      type2: "bar_point_gradient_pile",
      img: require('../assets/bar_point_gradient_pile.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "苹果",
          "三星",
          "小米",
          "oppo",
          "vivo"
        ],
        series: [{
          name: "手机品牌",
          data: [
            1000879,
            3400879,
            2300879,
            5400879,
            3400879
          ]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        gridX: 90,
        gridY: 0,
        gridX2: 30,
        gridY2: 0,
        legend: true,
        nameColor: "#eee",
        lineColor: "#eee",
        xNameFontSize: 16,
        yNameFontSize: 16,
        labelShow: true,
        labelShowColor: '#fff',
        labelShowFontSize: 14,
        labelShowFontWeight: 'normal',
        yAxisInverse: false,
        xAxisInverse: false,
        xAxisShow: true,
        yAxisShow: true,
        xAxisSplitLineShow: false,
        yAxisSplitLineShow: false,
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#83bff6",
          color2: "#188df0",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, ],
  }, {
    label: '条形图',
    type: "bar",
    icon: 'icon-bar',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '条形图',
      type: "bar",
      type2: "bar2",
      img: require('../assets/bar2.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
        ],
        series: [{
          name: "系列1",
          data: [200, 250, 150, 300]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }],
        barMinHeight: 2,
        xAxisType: "value",
        yAxisType: "category"
      }

    }, {
      label: '指标条形图',
      type: "bar",
      type2: "bar2_target",
      img: require('../assets/bar2_target.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "苹果",
          "三星",
          "小米",
          "oppo",
          "vivo"
        ],
        series: [{
          name: "手机品牌",
          data: [
            1000879,
            3400879,
            2300879,
            5400879,
            3400879
          ]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        gridX: 90,
        gridY: 0,
        gridX2: 30,
        gridY2: 0,
        legend: true,
        nameColor: "#eee",
        lineColor: "#eee",
        xNameFontSize: 16,
        yNameFontSize: 16,
        labelShow: true,
        labelShowColor: '#fff',
        labelShowFontSize: 14,
        labelShowFontWeight: 'normal',
        yAxisInverse: false,
        xAxisInverse: false,
        xAxisShow: true,
        yAxisShow: true,
        xAxisSplitLineShow: false,
        yAxisSplitLineShow: false,
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#83bff6",
          color2: "#188df0",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }

    }, {
      label: '堆叠条形图',
      type: "bar",
      type2: "bar2_pile",
      img: require('../assets/bar2_pile.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
          "类别4",
        ],
        series: [{
          name: "系列1",
          data: [130, 80, 100, 60]
        }, {
          name: "系列2",
          data: [80, 130, 130, 130]
        }, {
          name: "系列3",
          data: [80, 160, 80, 160]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#29C287",
          color2: "",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#fac858",
          color2: "",
          postion: 50,
          $index: 1,
          _show: true
        }, ],
        barMinHeight: 2,
        isStack: true,
        xAxisType: "value",
        yAxisType: "category"
      }

    }, {
      label: '带标题条形图',
      type: "bar",
      type2: "bar2_title",
      img: require('../assets/bar2_title.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "类别1",
          "类别2",
          "类别3",
        ],
        series: [{
          name: "系列1",
          data: [200, 250, 150]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 90,
          $index: 0,
          _show: true
        }],
        barMinHeight: 2,
        xAxisType: "value",
        yAxisType: "category",
        titleShow: true,
        title: '我是条形图的标题',
        titleColor: '#FFFFFF'
      }
    }, {
      label: '城市数据条形图',
      type: "bar",
      type2: "bar2_data",
      img: require('../assets/bar2_data.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "苹果",
          "三星",
          "小米",
          "oppo",
          "vivo"
        ],
        series: [{
          name: "手机品牌",
          data: [
            1000879,
            3400879,
            2300879,
            5400879,
            3400879
          ]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        gridX: 90,
        gridY: 0,
        gridX2: 30,
        gridY2: 0,
        legend: true,
        nameColor: "#eee",
        lineColor: "#eee",
        xNameFontSize: 16,
        yNameFontSize: 16,
        labelShow: true,
        labelShowColor: '#fff',
        labelShowFontSize: 14,
        labelShowFontWeight: 'normal',
        yAxisInverse: false,
        xAxisInverse: false,
        xAxisShow: true,
        yAxisShow: true,
        xAxisSplitLineShow: false,
        yAxisSplitLineShow: false,
        barWidth: 30,
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#83bff6",
          color2: "#188df0",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#23B7E5",
          color2: "#564AA3",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '参数渐变条形图',
      type: "bar",
      type2: "bar2_gradient",
      img: require('../assets/bar2_gradient.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "电器类",
          "家居类",
          "服饰类",
          "食品类",
        ],
        series: [{
          name: '用例1',
          data: [65, 96, 72, 128],
        }, {
          name: '用例2',
          data: [74, 54, 119, 43],
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        radiusTop: 0,
        radiusBottom: 0,
        radiusLeft: 0,
        radiusRight: 0,
        barColor: [{
          color1: "#375287",
          color2: "#5D95FF",
          postion: 70,
          $index: 0,
          _show: true
        }, {
          color1: "#2C8953",
          color2: "#29C287",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        xAxisType: "value",
        yAxisType: "category",
        titleShow: true,
        title: '全年热销类目',
        titleColor: '#FFFFFF',
        titlePostion: 'center',
        legend: false,
        labelShow: true,
        labelPosition: 'right',
      }
    }],
  }, {
    label: '折线图',
    type: 'line',
    icon: 'icon-line',
    img: require('../assets/layer_line.svg'),
    children: [{
      label: '基础折线图',
      type: "line",
      type2: "line_basic",
      img: require('../assets/line_basic.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例1",
          data: [800, 300, 500, 400, 450, 250]
        }, {
          name: "用例2",
          data: [500, 200, 130, 700, 900, 750]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '单折线图',
      type: "line",
      type2: "line_single",
      img: require('../assets/line_single.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例",
          data: [800, 300, 500, 400, 450, 250]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2
      }
    }, {
      label: '折线面积图',
      type: "line",
      type2: "line_area",
      img: require('../assets/line_area.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例1",
          data: [800, 300, 500, 400, 450, 250]
        }, {
          name: "用例2",
          data: [500, 200, 130, 700, 900, 750]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        areaStyle: true
      }
    }, {
      label: '单折面积图',
      type: "line",
      type2: "line_single_area",
      img: require('../assets/line_single_area.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例",
          data: [800, 300, 500, 400, 450, 250]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        areaStyle: true
      }
    }, {
      label: '直角折线面积图',
      type: "line",
      type2: "line_rightAngle_area",
      img: require('../assets/line_rightAngle_area.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例1",
          data: [800, 300, 500, 400, 450, 250]
        }, {
          name: "用例2",
          data: [500, 200, 130, 700, 900, 750]
        }, {
          name: "用例3",
          data: [300, 250, 736, 300, 600, 550]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#FAC858",
          color2: "#FAC858",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        areaStyle: true,
        lineWidth: 0,
        areaOpcity: 0.6,
        isSmooth: false
      }
    }, {
      label: '弧度折线面积图',
      type: "line",
      type2: "line_radian_area",
      img: require('../assets/line_radian_area.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例1",
          data: [800, 300, 500, 400, 450, 250]
        }, {
          name: "用例2",
          data: [500, 200, 130, 700, 900, 750]
        }, {
          name: "用例3",
          data: [300, 250, 736, 300, 600, 550]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }, {
          color1: "#FAC858",
          color2: "#FAC858",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        areaStyle: true,
        lineWidth: 0,
        areaOpcity: 0.6,
      }
    }, {
      label: '锚点折线图',
      type: "line",
      type2: "line_anchor",
      img: require('../assets/line_anchor.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      data: {
        categories: [
          "2023-01",
          "2023-02",
          "2023-03",
          "2023-04",
          "2023-05",
          "2023-06"
        ],
        series: [{
          name: "用例",
          data: [800, 300, 500, 400, 450, 250]
        }]
      },
      dataFormatter: "",
      time: 5000,
      option: {
        nameColor: "#eee",
        lineColor: "#eee",
        barWidth: 30,
        barRadius: 8,
        barColor: [{
          color1: "#29C287",
          color2: "#29C287",
          postion: 90,
          $index: 0,
          _show: true
        }, {
          color1: "#5D95FF",
          color2: "#5D95FF",
          postion: 50,
          $index: 1,
          _show: true
        }],
        barMinHeight: 2,
        symbolShow: true
      }
    }, ],
  }, {
    label: '环图',
    type: 'pie',
    icon: 'icon-pie',
    img: require('../assets/layer_cycle.svg'),
    children: [{
      label: '玫瑰图',
      type: 'pie',
      type2: "cycle_rose",
      img: require('../assets/cycle_rose.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
          value: 60,
          name: '家具家电'
        },
        {
          value: 47,
          name: '粮油副食'
        },
        {
          value: 26,
          name: '美容洗护'
        },
        {
          value: 17,
          name: '母婴用品'
        },
      ],
      dataFormatter: "",
      resize: false,
      option: {
        // legend: true,
        labelShow: true,
        barColor: [{
            color1: "#06F8A7"
          },
          {
            color1: "#5D95FF"
          },
          {
            color1: "#29C287"
          },
          {
            color1: "#FAC858"
          },
          {
            color1: "#564AA3"
          }
        ],
        radius: true,
        roseType: 'radius',
        radiusN: 40,
        radiusW: 80,
      }
    }, {
      label: '百分比环图',
      type: 'pie',
      type2: "cycle_percentage",
      img: require('../assets/cycle_percentage.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
        name: "苹果",
        value: 1000879,
        url: "http://www.baidu.com"
      }, {
        name: "三星",
        value: 3400879,
        url: "http://www.baidu.com"
      }, {
        name: "小米",
        value: 2300879,
        url: "http://www.baidu.com"
      }, {
        name: "oppo",
        value: 5400879,
        url: "http://www.baidu.com"
      }, {
        name: "大疆",
        value: 3000,
        url: "http://www.baidu.com"
      }, {
        name: "抖音",
        value: 2000,
        url: "http://www.baidu.com"
      }],
      dataFormatter: "",
      resize: false,
      option: {
        legend: true,
        labelShow: true,
        barColor: [{
            color1: "#83bff6"
          },
          {
            color1: "#23B7E5"
          },
          {
            color1: "rgba(154, 168, 212, 1)"
          },
          {
            color1: "#188df0"
          },
          {
            color1: "#564AA3"
          }
        ]
      }
    }, ],
  }, {
    label: '饼图',
    type: 'pie',
    icon: 'icon-pie',
    img: require('../assets/layer_pie.svg'),
    children: [{
      label: '基础饼图',
      type: 'pie',
      type2: "pie_basic",
      img: require('../assets/pie_basic.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
        name: "苹果",
        value: 1000879,
        url: "http://www.baidu.com"
      }, {
        name: "三星",
        value: 3400879,
        url: "http://www.baidu.com"
      }, {
        name: "小米",
        value: 2300879,
        url: "http://www.baidu.com"
      }, {
        name: "oppo",
        value: 5400879,
        url: "http://www.baidu.com"
      }, {
        name: "大疆",
        value: 3000,
        url: "http://www.baidu.com"
      }, {
        name: "抖音",
        value: 2000,
        url: "http://www.baidu.com"
      }],
      dataFormatter: "",
      resize: false,
      option: {
        legend: true,
        labelShow: true,
        barColor: [{
            color1: "#83bff6"
          },
          {
            color1: "#23B7E5"
          },
          {
            color1: "rgba(154, 168, 212, 1)"
          },
          {
            color1: "#188df0"
          },
          {
            color1: "#564AA3"
          }
        ]
      }
    }, {
      label: '百分比饼图',
      type: 'pie',
      type2: "pie_percentage",
      img: require('../assets/pie_percentage.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
        name: "苹果",
        value: 1000879,
        url: "http://www.baidu.com"
      }, {
        name: "三星",
        value: 3400879,
        url: "http://www.baidu.com"
      }, {
        name: "小米",
        value: 2300879,
        url: "http://www.baidu.com"
      }, {
        name: "oppo",
        value: 5400879,
        url: "http://www.baidu.com"
      }, {
        name: "大疆",
        value: 3000,
        url: "http://www.baidu.com"
      }, {
        name: "抖音",
        value: 2000,
        url: "http://www.baidu.com"
      }],
      dataFormatter: "",
      resize: false,
      option: {
        legend: true,
        labelShow: true,
        barColor: [{
            color1: "#83bff6"
          },
          {
            color1: "#23B7E5"
          },
          {
            color1: "rgba(154, 168, 212, 1)"
          },
          {
            color1: "#188df0"
          },
          {
            color1: "#564AA3"
          }
        ]
      }
    }, {
      label: '饼图示例',
      type: 'pie',
      type2: "pie_example",
      img: require('../assets/pie_example.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
        name: "苹果",
        value: 1000879,
        url: "http://www.baidu.com"
      }, {
        name: "三星",
        value: 3400879,
        url: "http://www.baidu.com"
      }, {
        name: "小米",
        value: 2300879,
        url: "http://www.baidu.com"
      }, {
        name: "oppo",
        value: 5400879,
        url: "http://www.baidu.com"
      }, {
        name: "大疆",
        value: 3000,
        url: "http://www.baidu.com"
      }, {
        name: "抖音",
        value: 2000,
        url: "http://www.baidu.com"
      }],
      dataFormatter: "",
      resize: false,
      option: {
        legend: true,
        labelShow: true,
        barColor: [{
            color1: "#83bff6"
          },
          {
            color1: "#23B7E5"
          },
          {
            color1: "rgba(154, 168, 212, 1)"
          },
          {
            color1: "#188df0"
          },
          {
            color1: "#564AA3"
          }
        ]
      }
    }, ],
  }, {
    label: '象形图',
    type: 'pictorialbar',
    icon: "icon-pictorialBar",
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '象形图',
      type: 'pictorialbar',
      type2: "layer_bar",
      img: require('../assets/layer_bar.svg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
        name: "苹果",
        value: 1000879,
      }, {
        name: "三星",
        value: 3400879,
      }, {
        name: "小米",
        value: 2300879,
      }, {
        name: "oppo",
        value: 5400879,
      }, {
        name: "大疆",
        value: 3000,
      }, {
        name: "抖音",
        value: 2000,
      }],
      dataFormatter: "",
      option: {
        symbolSize: 30,
        split: 30,
        symbol: '',
        fontSize: '24',
        xAxisShow: false,
        yAxisShow: true,
        color: '#4dffff',
        nameColor: '#564AA3',
        xNameFontSize: '24',
        yNameFontSize: '24',
      }
    }],
  }, {
    label: '雷达图',
    type: 'radar',
    icon: "icon-radar",
    img: require('../assets/layer_radar.svg'),
    children: [{
      label: '雷达图',
      type: 'radar',
      type2: "radar",
      img: require('../assets/radar.jpg'),
      width: 970,
      height: 400,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: {
        indicator: [{
            name: '销售',
            max: 6500
          },
          {
            name: '管理',
            max: 16000
          },
          {
            name: '信息技术',
            max: 30000
          },
          {
            name: '客服',
            max: 38000
          },
          {
            name: '研发',
            max: 52000
          },
          {
            name: '市场',
            max: 25000
          }
        ],
        series: [{
          data: [{
              value: [4300, 10000, 28000, 35000, 50000, 19000],
              name: '预算分配（Allocated Budget）'
            },
            {
              value: [5000, 14000, 28000, 31000, 42000, 21000],
              name: '实际开销（Actual Spending）'
            }
          ]
        }]
      },
      dataFormatter: "",
      option: {
        width: '100%',
        height: 600,
        titleShow: true,
        title: '各部门开销',
        subtext: '最近一个月',
        titleColor: '#666',
        tipBackgroundColor: 'rgba(50,50,50,0.7)',
        tipColor: "#fff",
        shape: 'polygon',
        radius: 75,
        splitNumber: 4,
        radarNameColor: '#fff',
        radarNameSize: 18,
        titleFontSize: 18,
        areaOpacity: 30,
        legend: true,
        labelShow: true,
        barColor: [{
            color1: "#564AA3",
          },
          {
            color1: "#188df0",
          }
        ]
      },
    }],
  }, {
    label: '散点图',
    type: 'scatter',
    icon: "icon-scatter",
    img: require('../assets/layer_scatter.svg'),
    children: [{
      label: '散点图',
      type: 'scatter',
      type2: "scatter",
      img: require('../assets/scatter.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
          data: [
            [1, 8.04],
            [2, 6.95]
          ]
        },
        {
          data: [
            [1, 4.04],
            [2, 3.95]
          ]
        }
      ],
      dataFormatter: "",
      component: {

        name: "scatter",
        prop: "scatter",
      },
      option: {
        lineSize: 25,
        barColor: [{
            postion: 0.2,
            color1: '#91c7ae'
          },
          {
            postion: 0.8,
            color1: '#63869e'
          },
          {
            postion: 1,
            color1: '#c23531'
          }
        ]
      }
    }, {
      label: '气泡图',
      type: 'scatter',
      type2: "scatter_bubble",
      img: require('../assets/scatter_bubble.jpg'),
      width: 600,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
          data: [
            [1, 8.04],
            [2, 6.95]
          ]
        },
        {
          data: [
            [1, 4.04],
            [2, 3.95]
          ]
        }
      ],
      dataFormatter: "",
      component: {

        name: "scatter",
        prop: "scatter",
      },
      option: {
        lineSize: 25,
        barColor: [{
            postion: 0.2,
            color1: '#91c7ae'
          },
          {
            postion: 0.8,
            color1: '#63869e'
          },
          {
            postion: 1,
            color1: '#c23531'
          }
        ]
      }
    }],
  }, {
    label: '漏斗图',
    type: 'funnel',
    icon: "icon-funnel",
    img: require('../assets/layer_funnel.svg'),
    children: [{
      label: '漏斗图',
      type: 'funnel',
      type2: "funnel",
      img: require('../assets/funnel.jpg'),
      width: 400,
      height: 300,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      dataMethod: 'get',
      time: 5000,
      data: [{
          value: 335,
          name: '直接访问'
        },
        {
          value: 310,
          name: '邮件营销'
        },
        {
          value: 234,
          name: '联盟广告'
        }
      ],
      dataFormatter: "",
      option: {
        radius: true,
        barColor: [{
            color1: "#83bff6",
          },
          {
            color1: "#23B7E5",
          },
          {
            color1: "rgba(154, 168, 212, 1)",
          },
          {
            color1: "#188df0",
          },
          {
            color1: "#564AA3",
          }
        ]
      }
    }],
  }, {
    label: '地图',
    type: 'map',
    icon: "icon-map",
    img: require('../assets/layer_map.svg'),
    children: [{
      label: '地图',
      type: 'map',
      type2: "map",
      img: require('../assets/map.jpg'),
      width: 800,
      height: 500,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      data: [],
      dataFormatter: "",
      option: {
        borderWidth: 1,
        scale: 87,
        type: 0,
        borderColor: "#0dffff",
        areaColor: "#061d33",
        banner: true,
        bannerTime: 3000,
        fontSize: 14,
        zoom: 0.4,
        empAreaColor: "rgba(35, 183, 229, 0.42)",
        empColor: "#fff",
        color: "rgba(13, 255, 255, 1)",
      }
    }, {
      label: '实景地图',
      type: 'map',
      type2: "map_real",
      img: require('../assets/map_real.jpg'),
      width: 800,
      height: 500,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      data: [],
      dataFormatter: "",
      option: {
        borderWidth: 1,
        scale: 87,
        type: 0,
        borderColor: "#0dffff",
        areaColor: "#061d33",
        banner: true,
        bannerTime: 3000,
        fontSize: 14,
        zoom: 0.4,
        empAreaColor: "rgba(35, 183, 229, 0.42)",
        empColor: "#fff",
        color: "rgba(13, 255, 255, 1)",
      }
    }],

  }, {
    label: '定时器',
    type: 'time',
    icon: 'icon-datetime',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '定时器',
      type: 'time',
      type2: 'time',
      img: require('../assets/layer_bar.svg'),
      width: 100,
      height: 100,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      echartFormatter: "(refs)=>{\n    console.log(refs)\n}",
      option: {
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        time: 0
      }
    }],

  }, {
    label: '滚动排名',
    type: 'scrollrank',
    icon: "icon-datav",
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '滚动排名',
      type: 'scrollrank',
      type2: 'scrollrank',
      img: require('../assets/layer_bar.svg'),
      width: 652.35,
      height: 248.45,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: [{
          name: "周口",
          value: 55
        },
        {
          name: "南阳",
          value: 120
        },
        {
          name: "西峡",
          value: 78
        },
        {
          name: "驻马店",
          value: 66
        },
        {
          name: "新乡",
          value: 80
        },
        {
          name: "信阳",
          value: 45
        },
        {
          name: "漯河",
          value: 29
        }
      ],
      dataFormatter: "",
      echartFormatter: "(data)=>{\n  return {\n    config:{\n\t    data: data,\n      //carousel: 'page',\n      valueFormatter ({ value }) {\n        return value+'单位'\n      }\n\t}\n  }\n}",
      option: {
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        is: "dv-scroll-ranking-board"
      }
    }],
  }, {
    label: '胶囊排名',
    type: 'scrollrank',
    icon: "icon-scrollrank",
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '胶囊排名',
      type: 'scrollrank',
      type2: 'scrollrank_capsulerank',
      img: require('../assets/layer_bar.svg'),
      width: 652.35,
      height: 248.45,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: [{
          name: "周口",
          value: 55
        },
        {
          name: "南阳",
          value: 120
        },
        {
          name: "西峡",
          value: 78
        },
        {
          name: "驻马店",
          value: 66
        },
        {
          name: "新乡",
          value: 80
        },
        {
          name: "信阳",
          value: 45
        },
        {
          name: "漯河",
          value: 29
        }
      ],
      dataFormatter: "",
      echartFormatter: "(data)=>{\n  return {\n    config:{\n\t    data: data,\n      colors: ['#e062ae', '#fb7293', '#e690d1', '#32c5e9', '#96bfff'],\n      unit: '单位',\n      showValue: true\n\t  }\n  }\n}",
      option: {
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        is: "dv-capsule-chart"
      }
    }],
  }, {
    label: '锥形柱图',
    type: 'scrollrank',
    icon: 'icon-datav',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '锥形柱图',
      type: 'scrollrank',
      type2: 'scrollrank_taperbar',
      img: require('../assets/layer_bar.svg'),
      width: 549.18,
      height: 262.98,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: [{
          name: '周口',
          value: 55
        },
        {
          name: '南阳',
          value: 120
        },
        {
          name: '西峡',
          value: 71
        },
        {
          name: '驻马店',
          value: 66
        },
        {
          name: '新乡',
          value: 80
        },
        {
          name: '信阳',
          value: 35
        },
        {
          name: '漯河',
          value: 15
        }
      ],
      dataFormatter: "",
      echartFormatter: "(data)=>{\n  return {\n    config:{\n      data:data,\n      img: [\n        '/img/conicalColumnChart/1st.png',\n        '/img/conicalColumnChart/2st.png',\n        '/img/conicalColumnChart/3st.png',\n        '/img/conicalColumnChart/4st.png',\n        '/img/conicalColumnChart/5st.png',\n        '/img/conicalColumnChart/6st.png',\n        '/img/conicalColumnChart/7st.png'\n      ],\n      showValue: true\n    }\n  }\n}",
      option: {
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        is: 'dv-conical-column-chart'
      }
    }],
  }, {
    label: '动态环图',
    type: 'scrollrank',
    icon: 'icon-datav',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '动态环图',
      type: 'scrollrank',
      type2: 'scrollrank_trendspie',
      icon: 'icon-datav',
      img: require('../assets/layer_bar.svg'),
      width: 949.32,
      height: 515.7,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: [{
          name: '周口',
          value: 55
        },
        {
          name: '南阳',
          value: 120
        },
        {
          name: '西峡',
          value: 78
        },
        {
          name: '驻马店',
          value: 66
        },
        {
          name: '新乡',
          value: 80
        }
      ],
      dataFormatter: "",
      echartFormatter: "(data)=>{\n  return {\n    config:{\n      radius: '40%',\n      activeRadius: '45%',\n      data: data,\n      digitalFlopStyle: {\n        fontSize: 20\n      },\n      showOriginValue: true\n    }\n  }\n}",
      option: {
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        is: 'dv-active-ring-chart'
      }
    }],
  }, {
    label: '水位图',
    type: 'pond',
    icon: 'icon-datav',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '水位图',
      type: 'pond',
      type2: 'pond_water',
      icon: 'icon-datav',
      img: require('../assets/layer_bar.svg'),
      width: 150,
      height: 200,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: {
        value: 66
      },
      dataFormatter: "",
      // echartFormatter: "(data)=>{\n  return {\n    config:{\n\t    data: data.value,\n      shape: 'roundRect'\n\t  }\n  }\n}",
      option: {
        is: 'dv-water-level-pond',
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        shape: 'rect',
        colors: ['rgba(0, 206, 209, 1)', 'rgba(0, 186, 189, 1)'],
        waveNum: 3,
        waveHeight: 40,
        waveOpacity: 40,
        formatter: '%',
        opacity: 100,
      }
    }],
  }, {
    label: '进度池',
    type: 'pond',
    icon: 'icon-datav',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '进度池',
      type: 'pond',
      type2: 'pond_progress',
      img: require('../assets/layer_bar.svg'),
      width: 369,
      height: 153,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: {
        value: 66
      },
      dataFormatter: "",
      //echartFormatter: "(data)=>{\n  return {\n    config:{\n      value: data.value,\n      borderWidth: 5,\n      borderRadius: 10,\n      borderGap: 5,\n      lineDash: [10, 2],\n      localGradient: true\n    }\n  }\n}",
      option: {
        is: 'dv-percent-pond',
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        colors: ['rgba(0, 206, 209, 1)', 'rgba(0, 186, 189, 1)'],
        borderWidth: 3,
        borderGap: 3,
        lineDash: [5, 1],
        textColor: '#fff',
        borderRadius: 5,
        localGradient: false,
        formatter: '%'

      }
    }],

  }, {
    label: '飞线图',
    type: 'flyline',
    icon: 'icon-datav',
    img: require('../assets/layer_bar.svg'),
    children: [{
      label: '飞线图',
      type: 'flyline',
      type2: 'flyline',
      img: require('../assets/layer_bar.svg'),
      width: 949.32,
      height: 515.7,
      top: 0,
      left: 0,
      backgroundColor: "rgba(35, 100, 255, 0.2)",
      dataType: 0,
      data: {
        points: [{
            name: "郑州",
            coordinate: [
              0.48,
              0.35
            ],
            halo: {
              show: true
            },
            icon: {
              src: "/img/flylineChart/mapCenterPoint.png",
              width: 30,
              height: 30
            },
            text: {
              show: false
            }
          },
          {
            name: "新乡",
            coordinate: [
              0.52,
              0.23
            ]
          },
          {
            name: "焦作",
            coordinate: [
              0.43,
              0.29
            ]
          },
          {
            name: "开封",
            coordinate: [
              0.59,
              0.35
            ]
          },
          {
            name: "许昌",
            coordinate: [
              0.53,
              0.47
            ]
          },
          {
            name: "平顶山",
            coordinate: [
              0.45,
              0.54
            ]
          },
          {
            name: "洛阳",
            coordinate: [
              0.36,
              0.38
            ]
          },
          {
            name: "周口",
            coordinate: [
              0.62,
              0.55
            ],
            halo: {
              show: true,
              color: "#8378ea"
            }
          },
          {
            name: "漯河",
            coordinate: [
              0.56,
              0.56
            ]
          },
          {
            name: "南阳",
            coordinate: [
              0.37,
              0.66
            ],
            halo: {
              show: true,
              color: "#37a2da"
            }
          },
          {
            name: "信阳",
            coordinate: [
              0.55,
              0.81
            ]
          },
          {
            name: "驻马店",
            coordinate: [
              0.55,
              0.67
            ]
          },
          {
            name: "济源",
            coordinate: [
              0.37,
              0.29
            ]
          },
          {
            name: "三门峡",
            coordinate: [
              0.2,
              0.36
            ]
          },
          {
            name: "商丘",
            coordinate: [
              0.76,
              0.41
            ]
          },
          {
            name: "鹤壁",
            coordinate: [
              0.59,
              0.18
            ]
          },
          {
            name: "濮阳",
            coordinate: [
              0.68,
              0.17
            ]
          },
          {
            name: "安阳",
            coordinate: [
              0.59,
              0.1
            ]
          }
        ],
        lines: [{
            "source": "新乡",
            "target": "郑州"
          },
          {
            "source": "焦作",
            "target": "郑州"
          },
          {
            "source": "开封",
            "target": "郑州"
          },
          {
            "source": "周口",
            "target": "郑州",
            "color": "#fb7293",
            width: 2
          },
          {
            "source": "南阳",
            "target": "郑州",
            "color": "#fb7293",
            width: 2
          },
          {
            "source": "济源",
            "target": "郑州"
          },
          {
            "source": "三门峡",
            "target": "郑州"
          },
          {
            "source": "商丘",
            "target": "郑州"
          },
          {
            "source": "鹤壁",
            "target": "郑州"
          },
          {
            "source": "濮阳",
            "target": "郑州"
          },
          {
            "source": "安阳",
            "target": "郑州"
          },
          {
            "source": "许昌",
            "target": "南阳",
            "color": "#37a2da"
          },
          {
            "source": "平顶山",
            "target": "南阳",
            "color": "#37a2da"
          },
          {
            "source": "洛阳",
            "target": "南阳",
            "color": "#37a2da"
          },
          {
            "source": "驻马店",
            "target": "周口",
            "color": "#8378ea"
          },
          {
            "source": "信阳",
            "target": "周口",
            "color": "#8378ea"
          },
          {
            "source": "漯河",
            "target": "周口",
            "color": "#8378ea"
          }
        ]
      },
      lines: [{
          "source": "新乡",
          "target": "郑州"
        },
        {
          "source": "焦作",
          "target": "郑州"
        },
        {
          "source": "开封",
          "target": "郑州"
        },
        {
          "source": "周口",
          "target": "郑州",
          "color": "#fb7293",
          width: 2
        },
        {
          "source": "南阳",
          "target": "郑州",
          "color": "#fb7293",
          width: 2
        },
        {
          "source": "济源",
          "target": "郑州"
        },
        {
          "source": "三门峡",
          "target": "郑州"
        },
        {
          "source": "商丘",
          "target": "郑州"
        },
        {
          "source": "鹤壁",
          "target": "郑州"
        },
        {
          "source": "濮阳",
          "target": "郑州"
        },
        {
          "source": "安阳",
          "target": "郑州"
        },
        {
          "source": "许昌",
          "target": "南阳",
          "color": "#37a2da"
        },
        {
          "source": "平顶山",
          "target": "南阳",
          "color": "#37a2da"
        },
        {
          "source": "洛阳",
          "target": "南阳",
          "color": "#37a2da"
        },
        {
          "source": "驻马店",
          "target": "周口",
          "color": "#8378ea"
        },
        {
          "source": "信阳",
          "target": "周口",
          "color": "#8378ea"
        },
        {
          "source": "漯河",
          "target": "周口",
          "color": "#8378ea"
        }
      ],
      dataFormatter: "",
      option: {
        is: 'dv-flyline-chart-enhanced',
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        bgImgSrc: '',
        relative: true,
        halo: {
          show: false,
          duration: {
            x: 20,
            y: 30
          },
          color: '#fb7293',
          radius: 120
        },
        text: {
          show: false,
          offset: {
            x: 0,
            y: 15
          },
          color: '#ffdb5c',
          fontSize: 12
        },
        icon: {
          show: false,
          src: '',
          width: 15,
          height: 15
        },
        line: {
          width: 1,
          color: '#ffde93',
          orbitColor: 'rgba(103,224,227,.2)',
          duration: {
            x: 20,
            y: 30
          },
          radius: 100,
          curvature: 5,
          k: -0.5,
        }
      }
    }],

  }, ]
}, {
  label: '文字',
  icon: 'el-icon-document',
  type: 'text',
  img: require('../assets/text.svg'),
  img2: require('../assets/text2.svg'),
  children: [{
    label: '文本框',
    type: 'text',
    type2: 'text',
    icon: 'icon-text',
    img: require('../assets/layer_bar.svg'),
    width: 100,
    height: 40,
    top: 0,
    left: 0,
    backgroundColor: "rgba(35, 100, 255, 0.2)",
    dataType: 0,
    dataFormatter: "",
    data: {
      value: '文本框'
    },
    option: {
      textAlign: "center",
      fontSize: 26,
      fontWeight: "normal",
      color: "#fff"
    },
  }, {
    label: '跑马灯',
    type: 'text',
    type2: 'text_run',
    icon: 'icon-scroll',
    img: require('../assets/layer_bar.svg'),
    width: 100,
    height: 50,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      value: "跑马灯"
    },
    dataFormatter: "",
    option: {
      scroll: true,
      speed: 70,
      textAlign: "center",
      fontSize: 26,
      fontWeight: "normal",
      color: "#fff"
    },
  }, {
    label: '超链接',
    type: 'text',
    type2: 'text_link',
    icon: 'icon-link',
    img: require('../assets/layer_bar.svg'),
    width: 100,
    height: 50,
    top: 0,
    left: 0,
    data: {
      value: "超链接"
    },
    dataFormatter: "",
    option: {
      link: true,
      linkHref: 'https://www.learun.cn',
      linkTarget: '_self',
      textAlign: "center",
      fontSize: 26,
      fontWeight: "normal",
      color: "#fff"
    },
  }, {
    label: '实时时间',
    type: 'datetime',
    type2: 'datetime',
    icon: 'icon-datetime',
    img: require('../assets/layer_bar.svg'),
    width: 250,
    height: 50,
    top: 78,
    left: 1604,
    option: {
      format: 'yyyy-MM-dd hh:mm:ss',
      color: "#fff",
      'textAlign': 'left',
      fontSize: 24,
      fontWeight: "normal"
    }
  }]
}, {
  label: '媒体',
  icon: 'el-icon-picture-outline',
  type: 'media',
  img: require('../assets/picture.svg'),
  img2: require('../assets/picture2.svg'),
  children: [{
    label: '图片',
    type: 'img',
    type2: 'img',
    icon: 'icon-img',
    img: require('../assets/layer_bar.svg'),
    width: 140,
    height: 140,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      value: ''
    },
    dataFormatter: "",
    option: {
      duration: '1000',
      opacity: 100,
    }
  }, {
    label: '图片框',
    type: 'imgborder',
    type2: 'imgborder',
    icon: 'icon-img',
    img: require('../assets/layer_bar.svg'),
    width: 140,
    height: 140,
    top: 0,
    left: 0,
    option: {
      opacity: 100,
      backgroundColor: 'rgba(180, 181, 198, 0.1)',
    }
  }, {
    label: '轮播图',
    type: 'swiper',
    type2: 'swiper',
    icon: 'icon-banner',
    img: require('../assets/layer_bar.svg'),
    width: 670,
    height: 370,
    top: 0,
    left: 0,
    dataType: 0,
    dataMethod: 'get',
    time: 5000,
    data: [{
      value: 'https://img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg',
    }, {
      value: 'https://img.alicdn.com/tfs/TB1uevcCrj1gK0jSZFuXXcrHpXa-1880-640.jpg',
    }],
    dataFormatter: "",
    option: {
      type: '',
      interval: 5000,
      opacity: 100,
      indicator: 'none'
    },
  }, {
    label: 'iframe',
    img: require('../assets/layer_bar.svg'),
    type: 'iframe',
    type2: 'iframe',
    icon: 'icon-iframe',
    width: 670,
    height: 370,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      value: 'https://www.learun.cn'
    },
    dataFormatter: "",
    option: {},
  }, {
    label: 'video',
    type: 'video',
    type2: 'video',
    icon: 'icon-video',
    img: require('../assets/layer_bar.svg'),
    width: 670,
    height: 370,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      value: 'http://www.w3school.com.cn/i/movie.ogg'
    },
    dataFormatter: "",
    option: {},
  }]
}, {
  label: '边框',
  icon: 'el-icon-full-screen',
  type: 'border',
  img: require('../assets/picture.svg'),
  img2: require('../assets/picture2.svg'),
  children: [{
      label: '边框1',
      type: 'border',
      type2: 'border1',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 1,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '边框2',
      type: 'border',
      type2: 'border2',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 2,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '边框3',
      type: 'border',
      type2: 'border3',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 3,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '边框4',
      type: 'border',
      type2: 'border4',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 4,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '边框5',
      type: 'border',
      type2: 'border5',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 5,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框6',
      type: 'border',
      type2: 'border6',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 6,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框7',
      type: 'border',
      type2: 'border7',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 7,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框8',
      type: 'border',
      type2: 'border8',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 8,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框9',
      type: 'border',
      type2: 'border9',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 9,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框10',
      type: 'border',
      type2: 'border10',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 10,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '边框11',
      type: 'border',
      type2: 'border11',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 11,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        title: 'border-box-11',
        titleWidth: 250,
        opacity: 100,
        // fontSize: 16,
        // titleColor: 'rgba(0,0,0,1)'
      }
    },
    {
      label: '边框12',
      type: 'border',
      type2: 'border12',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 480,
      height: 220,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 12,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }
  ]
}, {
  label: '装饰',
  icon: 'el-icon-brush',
  type: 'decoration',
  img: require('../assets/picture.svg'),
  img2: require('../assets/picture2.svg'),
  children: [{
      label: '装饰1',
      type: 'decoration',
      type2: 'decoration1',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 1,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '装饰2',
      type: 'decoration',
      type2: 'decoration2',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 2,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '装饰3',
      type: 'decoration',
      type2: 'decoration3',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 3,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '装饰4',
      type: 'decoration',
      type2: 'decoration4',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 4,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }, {
      label: '装饰5',
      type: 'decoration',
      type2: 'decoration5',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 5,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '装饰6',
      type: 'decoration',
      type2: 'decoration6',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 6,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '装饰7',
      type: 'decoration',
      type2: 'decoration7',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 7,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        content: '',
        opacity: 100,
      }
    },
    {
      label: '装饰8',
      type: 'decoration',
      type2: 'decoration8',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 8,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '装饰9',
      type: 'decoration',
      type2: 'decoration9',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 9,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '装饰10',
      type: 'decoration',
      type2: 'decoration10',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 10,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    },
    {
      label: '装饰11',
      type: 'decoration',
      type2: 'decoration11',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 11,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        content: '',
        opacity: 100,
      }
    },
    {
      label: '装饰12',
      type: 'decoration',
      type2: 'decoration12',
      icon: 'icon-img',
      img: require('../assets/layer_bar.svg'),
      width: 400,
      height: 60,
      top: 0,
      left: 0,
      dataType: 0,
      dataFormatter: "",
      option: {
        duration: '3',
        mainColor: 'rgba(131, 191, 246, 1)',
        subColor: 'rgba(0, 206, 209, 1)',
        borderValue: 12,
        rotateX: 0,
        rotateY: 0,
        rotateZ: 0,
        scale: 1,
        animateValue: '',
        opacity: 100,
      }
    }
  ]
}, {
  label: '组件',
  icon: 'el-icon-menu',
  type: 'module',
  img: require('../assets/module.svg'),
  img2: require('../assets/module2.svg'),
  children: [{
    label: '翻牌器',
    type: 'flop',
    type2: 'flop',
    icon: 'icon-flop',
    img: require('../assets/layer_bar.svg'),
    width: 300,
    height: 100,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      value: '12345'
    },
    dataFormatter: "",
    option: {
      type: "img",
      suffixText: "",
      suffixTextAlign: "",
      suffixSplit: '',
      suffixColor: "",
      suffixFontSize: '',
      borderColor: "#fff",
      borderWidth: 3,
      backgroundBorder: "",
      backgroundImage: '',
      fontSize: 32,
      fontWeight: "normal",
      splitx: 0,
      splity: 0,
      backgroundColor: "",
      color: "#fff"
    },
  }, {
    label: '颜色块',
    type: 'colorblock',
    type2: 'colorblock',
    icon: 'icon-flop',
    img: require('../assets/layer_bar.svg'),
    width: 888,
    height: 203,
    top: 0,
    left: 0,
    dataType: 0,
    data: [{
      backgroundColor: '#67C23A',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }, {
      backgroundColor: '#409EFF',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }, {
      backgroundColor: '#E6A23C',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }, {
      backgroundColor: '#F56C6C',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }, {
      backgroundColor: '#7232dd',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }, {
      backgroundColor: 'blue',
      prefixText: "某某某总人数",
      value: '12345',
      suffixText: '人',
    }],
    dataFormatter: "",
    option: {
      span: 3,
      decimals: 2,
      whole: true,
      padding: 12,
      textAlign: 'left',
      splity: 23,
      splitx: 17,
      fontSize: 28,
      prefixSplity: 4,
      prefixFontSize: 13,
      backgroundColor: "#F56C6C",
      suffixText: '人',
      suffixInline: true,
      suffixSplitx: 10,
      suffixFontSize: 18,
    },
  }, {
    label: '环形图',
    type: 'progress',
    type2: 'progress',
    icon: 'icon-circle',
    img: require('../assets/layer_bar.svg'),
    width: 300,
    height: 300,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      label: "人数增涨",
      value: 40,
      data: 80
    },
    dataFormatter: "",
    option: {
      type: "circle",
      strokeWidth: 25,
      color: "rgba(154, 168, 212, 1)",
      fontSize: 40,
      fontWeight: "normal",
      suffixColor: "rgba(154, 168, 212, 1)",
      suffixFontSize: 40,
      suffixFontWeight: "normal",
      borderColor: "#564AA3",
      split: 20,
      width: 400,
      height: 80
    },
  }, {
    label: '进度条',
    type: 'progress',
    type2: 'progress2',
    icon: 'icon-progress',
    img: require('../assets/layer_bar.svg'),
    width: 400,
    height: 80,
    top: 0,
    left: 0,
    dataType: 0,
    data: {
      label: "人数增涨",
      value: 40,
      data: 80
    },
    dataFormatter: "",
    option: {
      type: "line",
      color: "#fff",
      fontSize: 24,
      suffixColor: "#fff",
      strokeWidth: 18,
      fontWeight: "normal",
      borderColor: "#564AA3",
      width: 400,
      height: 80
    },
  }, {
    label: '仪表盘',
    type: 'gauge',
    type2: 'gauge',
    icon: 'icon-gauge',
    img: require('../assets/layer_gauge.svg'),
    width: 390,
    height: 314,
    left: 0,
    top: 0,
    name: "仪表盘",
    dataType: 0,
    dataMethod: 'get',
    time: 5000,
    data: {
      min: 1,
      max: 10,
      label: '名称',
      value: 4,
      unit: '%'
    },
    dataFormatter: "",
    option: {
      lineSize: 15,
      axisLabelShow: false,
      axisLabelFontSize: 25,
      nameFontSize: 20,
      valueFontSize: 30,
      nameColor: "",
      lineColor: "#eee",
      barColor: [{
          color1: "rgba(154, 168, 212, 1)",
          postion: "0.2",
        },
        {
          color1: "#23B7E5",
          postion: "0.8",
        },
        {
          color1: "#564AA3",
          postion: "1",
        }
      ]
    },
  }, {
    label: '字符云',
    type: 'wordcloud',
    type2: 'wordcloud',
    icon: 'icon-wordCloud',
    img: require('../assets/layer_bar.svg'),
    width: 600,
    height: 300,
    top: 0,
    left: 0,
    dataType: 0,
    dataMethod: 'get',
    data: [{
      name: '三星',
      value: '1234'
    }, {
      name: '小米',
      value: '1234'
    }, {
      name: '华为',
      value: '1234'
    }, {
      name: 'oppo',
      value: '1234'
    }, {
      name: '抖音',
      value: '1234'
    }, {
      name: '快手',
      value: '1234'
    }, {
      name: '淘宝',
      value: '1234'
    }, {
      name: '百度',
      value: '1234'
    }, {
      name: '京东',
      value: '1234'
    }, {
      name: '天猫',
      value: '1234'
    }, {
      name: '字符1',
      value: '1234'
    }, {
      name: '字符1',
      value: '1234'
    }],
    dataFormatter: "",
    time: 5000,
    option: {
      minFontSize: 30,
      maxFontSize: 80,
      split: 30,
      rotate: true,
    }
  }]
}, {
  label: '表格',
  icon: 'el-icon-date',
  type: 'table',
  img: require('../assets/module.svg'),
  img2: require('../assets/module2.svg'),
  children: [{
    label: '表格',
    type: 'table',
    type2: 'table',
    icon: 'icon-table',
    img: require('../assets/layer_bar.svg'),
    width: 500,
    height: 200,
    top: 0,
    left: 0,
    dataType: 0,
    data: [{
      type1: '数据1',
      type2: '数据2'
    }, {
      type1: '数据1',
      type2: '数据2'
    }],
    dataFormatter: "",
    option: {
      headerBackground: 'rgba(0, 0, 0, 0.01)',
      headerColor: 'rgba(154, 168, 212, 1)',
      headerTextAlign: 'center',
      bodyBackground: 'rgba(0, 0, 0, 0.01)',
      bodyColor: 'rgba(154, 168, 212, 1)',
      borderColor: 'rgba(51, 65, 107, 1)',
      bodyTextAlign: 'center',
      column: [{
          label: "类型1",
          prop: "type1"
        },
        {
          label: "类型2",
          prop: "type2"
        },
      ]
    }
  }, {
    label: '选项卡',
    type: 'tabs',
    type2: 'tabs',
    icon: 'icon-tabs',
    img: require('../assets/layer_bar.svg'),
    width: 356.9128919860628,
    height: 46.209059233449096,
    top: 0,
    left: 0,
    child: {
      index: [],
      paramName: ""
    },
    dataFormatter: "",
    dataType: 0,
    data: [{
        label: "选项卡1",
        value: "1"
      },
      {
        label: "选项卡2",
        value: "2"
      }
    ],
    option: {
      type: 'tabs',
      color: "#eee",
      empColor: "#4dffff",
      fontSize: 20,
      split: 8,
      empBackgroundImage: "",
      backgroundImage: ""
    },
  }]
}]